<template>
	<view :class="['index', BackGround ]" :style="[{'font-weight':Style,'font-family':Font,height:100 + '%',minHeight:height + 'px'}]">
		<view class="fixed" :style="{height:CustomBar+'rpx',lineHeight:CustomBar+'rpx',background:'rgba(56,165,242,'+opcity+')'}">
			<view :style="{opacity:opcity,paddingTop:StatusBar/2 + 'rpx'}">
				{{userinfo.lusername}}
			</view>
		</view>
		<view class="userbg" :style="{backgroundImage: 'url(https://www.ahlinghui.com/Uploads/image/20190429/images/user-bg' + num + '.png)'}"></view>
		<view class="weather" v-if="weatherisShow">
			<view class="text-sl text-white " style="padding-left: 20rpx;text-align: center;">{{weather.wendu}}
				<text class="cuIcon-round" style="position: absolute;top: 0px;font-size: 20rpx;"></text>
			</view>
			<view class="text-white">
				<text> {{weather.forecast[0].type}} {{high}}/{{low}}℃</text>
			</view>
		</view>
		<view>
			<view :class="['cu-list menu card-menu margin-top-xl margin-bottom-xl shadow-lg radius usercode',BackGroundBox]">
				<view class="userinfo">
					<image v-if="isShow" @error="imageError" style="border-radius:50%;border: 1px solid #ccc;box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.2);"
					 @click="JumpLogin" :src="imgList || ip + '/image/UserImage/FaceImage/' + userinfo.lphoto"></image>
					<text class="text-grey" style="text-shadow:3px 3px 4px rgba(26, 26, 26, 0.2)" :style="{opacity:opcity >= 1 ? 0 : 1}">{{userinfo.lusername}}</text>
				</view>
				<view class="padding flex text-center text-grey shadow-warp">
					<view class="flex flex-sub flex-direction solid-right" @click="jumpMessage">
						<view class="">
							<image mode="aspectFit" class="myimgs" src="/static/images/notificationfill.png"></image>
						</view>
						<view class="text-xxl text-orange margin-top-sm">公司公告</view>
					</view>
					<view class="flex flex-sub flex-direction solid-right" @click="jumpSetting">
						<view class="">
							<image mode="aspectFit" class="myimgs" src="/static/images/settings.png"></image>
						</view>
						<view class="text-xxl text-blue margin-top-sm">工作提醒</view>
					</view>
					<view class="flex flex-sub flex-direction solid-right" @click="userout">
						<view class="">
							<image mode="aspectFit" class="myimgs" src="/static/images/pullright.png"></image>
						</view>
						<view class="text-xxl text-green margin-top-sm">作业</view>
					</view>
					<view class="flex flex-sub flex-direction" @click="fault">
						<view class="">
							<image mode="aspectFit" class="myimgs" src="/static/images/fault.png"></image>
						</view>
						<view class="text-xxl text-red margin-top-sm">故障申报</view>
					</view>
				</view>
			</view>
			<view :class="['cu-list menu card-menu margin-top-xl margin-bottom-xl shadow-lg radius userlist margin-xs radius shadow shadow-lg',BackGroundBox]"
			 v-if="Commonly.length == 0 ? false : true">
				<view style="color: #888888;font-weight: bold;padding: 20rpx;">常用项</view>
				<list-box ref="reflist" :list="Commonly" @jumpview="jumpviewonly" @zylongtap="homelongtap"></list-box>
			</view>
			<view :class="['cu-list menu card-menu margin-top-xl margin-bottom-xl shadow-lg radius userlist margin-xs radius shadow shadow-lg',BackGroundBox]">
				<view style="color: #888888;font-weight: bold;padding: 20rpx;">基本项</view>
				<list-box ref="reflist" :list="userlist" @jumpview="jumpview"></list-box>
			</view>
		</view>
		<chunLei-popups v-model="value1" :popData="data" @tapPopup="hometapPopup" @zyinput="zyinput" :x="x" :y="y" placement="top-end"></chunLei-popups>
		<view class="register-section">
			<text>Copyright © 安徽柠徽信息工程有限公司</text>
		</view>
	</view>
</template>

<script>
	import {
		postlogin
	} from "@/service/login.js";
	import {
		getoa,
		getbind
	} from "@/service/home.js";
	import {
		getUserStaple
	} from "@/service/selectList.js";
	import {
		deleteUserStaple
	} from "@/service/selectList"
	import Drag from "@/colorui/components/drag/Drag.vue"
	import ListBox from '@/colorui/components/list.vue'
	import chunLeiPopups from "@/colorui/components/chunLei-popups/chunLei-popups"
	import utils from '@/static/js/utils.filter.js';
	import {
		mapGetters
	} from 'vuex'
	import {
		Commonly,
	} from "@/mixin/mixin.js"
	export default {
		mixins: [Commonly],
		data() {
			return {
				opcity: uni.getStorageSync('opcity') || 0,
				scrollH: 0, //滚动总高度
				isShow: false,
				weatherisShow: false,
				StatusBar: this.StatusBar,
				height: this.screenHeight,
				CustomBar: this.CustomBar,
				userinfo: '',
				weather: "",
				num: 1,
				high: '',
				low: '',
				lusercode: uni.getStorageSync('lusercode'),
				lpassword: uni.getStorageSync('lpassword'),
				userlist: [],
				imgList: '',
				data: [{
					title: '删除常用项',
				}],
				Commonly: "",
				falg: false,
			};
		},
		computed: {
			...mapGetters([
				'Style', 'Font', 'BackGround', 'BackGroundBox'
			]),
			ip() {
				let ip = uni.getStorageSync('IP') || 'http://60.173.239.156'
				let port = uni.getStorageSync('PORT') || '8443'
				return ip + ':' + port
			},
		},
		components: {
			ListBox,
			Drag,
			chunLeiPopups
		},
		onPageScroll(e) {
			this.value1 = false
			this.x = 0
			this.y = 0
			let scroll = e.scrollTop <= 0 ? 0 : e.scrollTop;
			let opcity = scroll / this.scrollH;
			if (this.opcity >= 1 && opcity >= 1) {
				return;
			}
			this.opcity = opcity;
			let myopcity = opcity
			uni.setStorage({
				key: "opcity",
				data: myopcity,
				success: function() {}
			})
		},
		onResize(res) {
			console.log(res);
		},
		onHide() {
			global.tree = true
		},
		onShow() {
			// uni.request({
			// 	url: uni.getStorageSync('IP') + ':' + uni.getStorageSync('PORT') + '/api/workInquire',
			// 	data: {
			// 		lid: 3,
			// 		lusercode:uni.getStorageSync('userinfo').lusercode
			// 	},
			// 	timeout: 10000,
			// 	header: {
			// 		'token': uni.getStorageSync('token')
			// 	},
			// 	success: (res) => {
			// 		if (res.data.code == 1) {
			// 			console.log(res.data);
			// 		} else {

			// 		}
			// 	},
			// 	fail: (err) => {

			// 	}
			// });
			// #ifdef APP-PLUS
			// 锁定屏幕方向
			plus.screen.lockOrientation('portrait-primary'); //锁定 
			// #endif
			// console.log(global.tree);
			this.lusercode = uni.getStorageSync('lusercode');
			this.lpassword = uni.getStorageSync('lpassword');
			global.isPush = true //可以执行推送跳转页面事件
			this.opcity = uni.getStorageSync('opcity');
			if (global.tree) {
				global.tree = false
				this.getsilder()
				getUserStaple(global.userinfo.lusercode).then(res => {
					if (res.code === 1) {
						this.Commonly = res.data
						global.Commonly = false
					} else {
						uni.showToast({
							title: '获取常用项失败！',
							icon: 'none'
						})
					}
				}).catch(err => {
					uni.showToast({
						title: '访问服务器失败！',
						icon: 'none'
					})
				})
			}
			if (global.Commonly) {
				getUserStaple(global.userinfo.lusercode).then(res => {
					if (res.code === 1) {
						this.Commonly = res.data
						global.Commonly = false
					} else {
						uni.showToast({
							title: '获取常用项失败！',
							icon: 'none'
						})
					}
				}).catch(err => {
					uni.showToast({
						title: '访问服务器失败！',
						icon: 'none'
					})
				})
			}
			if (global.userRefresh) {
				this.userinfo = global.userinfo
				getUserStaple(global.userinfo.lusercode).then(res => {
					if (res.code === 1) {
						this.Commonly = res.data
						global.userRefresh = false
					} else {
						uni.showToast({
							title: '获取常用项失败！',
							icon: 'none'
						})
					}
				}).catch(err => {
					uni.showToast({
						title: '访问服务器失败！',
						icon: 'none'
					})
				})
				this.isShow = true
			}
			try {
				if (!uni.getStorageSync('BackGround-Flag')) {
					console.log('用户关闭了护眼模式');
					let time = utils.timeTodate('H:i', new Date().getTime());
					let date = uni.getStorageSync('weather');
					if (this.CompareDate(time, date.forecast[0].sunrise) && !this.CompareDate(time, date.forecast[0].sunset)) {
						console.log('现在是白天');
						this.$store.commit('setBackGround', 'uni-bg-color-day');
						this.$store.commit('setBackGroundBox', 'uni-bg-color-day-box');
						uni.setStorage({
							key: 'BackGround',
							data: 'uni-bg-color-day'
						})
						uni.setStorage({
							key: 'BackGroundBox',
							data: 'uni-bg-color-day-box'
						})
					} else {
						console.log('现在是夜间');
						this.$store.commit('setBackGround', 'uni-bg-color-night');
						this.$store.commit('setBackGroundBox', 'uni-bg-color-night-box');
						uni.setStorage({
							key: 'BackGround',
							data: 'uni-bg-color-night'
						})
						uni.setStorage({
							key: 'BackGroundBox',
							data: 'uni-bg-color-night-box'
						})
					}
				} else {
					// console.log('用户开启了护眼模式');
					this.$store.commit('setBackGround', 'uni-bg-color-night');
					this.$store.commit('setBackGroundBox', 'uni-bg-color-night-box');
					uni.setStorage({
						key: 'BackGround',
						data: 'uni-bg-color-night'
					})
					uni.setStorage({
						key: 'BackGroundBox',
						data: 'uni-bg-color-night-box'
					})
				}
			} catch (e) {

			}
		},
		onReady() {
			setTimeout(() => {
				this.$nextTick(() => {
					const query = uni.createSelectorQuery().in(this);
					query.select('.index').boundingClientRect(data => {
						this.scrollH = data.height - this.screenHeight
						if (this.scrollH > uni.upx2px(400)) {
							this.scrollH = uni.upx2px(400)
						}
					}).exec();
				})
			}, 500)
		},
		onLoad() {
			this.userlist = [{
					img: '/static/images/workshop.png',
					name: '车间管理',
					isShow: false,
					fixed: false
				},
				{
					img: '/static/images/OA.png',
					name: 'OA办公',
					isShow: false,
					fixed: false
				},
				{
					img: '/static/images/Reportform.png',
					name: '生产报表',
					LMENUID: 9706,
					isShow: false,
					fixed: false
				},
				{
					img: '/static/images/temperature.png',
					name: '环境监测',
					LMENUID: '9711',
					isShow: false,
					fixed: false
				},
				{
					img: '/static/images/equipment.png',
					name: '设备维修',
					LMENUID: "9708",
					isShow: false,
					fixed: false
				},
				{
					img: '/static/images/personnel.png',
					name: '人员管理',
					LMENUID: '9803',
					isShow: false,
					fixed: false
				},
				{
					img: '/static/images/production.png',
					name: '作业调度',
					LMENUID: '9709',
					isShow: false,
					fixed: false
				},
				{
					img: '/static/images/quality.png',
					name: '实时管理',
					LMENUID: 9706,
					isShow: false,
					fixed: false
				},
				{
					img: '/static/images/system.png',
					name: '系统维护',
					isShow: false,
					fixed: false
				},
				{
					img: '/static/images/systemindex.png',
					name: '系统设置',
					isShow: true,
					fixed: false
				},
			]
			// #ifdef APP-PLUS
			let id = uni.getStorageSync('IP') + ':' + uni.getStorageSync('PORT')
			if (uni.getStorageSync('clientid') == '') {
				getbind(plus.push.getClientInfo().clientid,id).then(res => {
					uni.setStorage({
						key: "clientid",
						data: 'clientid',
						success: function() {}
					});
				})
			}
			// #endif
			if (!uni.getStorageSync('olddate')) {
				uni.setStorage({
					key: "IP",
					data: 'http://60.173.239.156',
					success: function() {}
				});
				uni.setStorage({
					key: "PORT",
					data: '8443',
					success: function() {}
				});
			}
			uni.setStorage({
				key: "newdate",
				data: new Date().getTime(),
				success: (res) => {
					if ((uni.getStorageSync('newdate') - uni.getStorageSync('olddate') > 1800000)) {
						uni.request({
							url: 'http://t.weather.sojson.com/api/weather/city/101220301'
						}).then(res => {
							if (res[1].statusCode == 200) {
								this.weather = res[1].data.data
								this.high = parseInt(this.weather.forecast[0].high.replace(/[^0-9]/ig, ""))
								this.low = parseInt(this.weather.forecast[0].low.replace(/[^0-9]/ig, ""));
								if (this.weather.forecast[0].type.indexOf("雨") != -1) {
									this.num = 2
								} else if (this.weather.forecast[0].type.indexOf("晴") != -1) {
									this.num = 1
								} else {
									this.num = 3
								}
								uni.setStorage({
									key: 'weather',
									data: res[1].data.data
								})
								this.weatherisShow = true
								uni.setStorage({
									key: "olddate",
									data: new Date().getTime(),
									success: function() {}
								});
							} else {
								this.weather = uni.getStorageSync('weather')
								this.high = parseInt(this.weather.forecast[0].high.replace(/[^0-9]/ig, ""))
								this.low = parseInt(this.weather.forecast[0].low.replace(/[^0-9]/ig, ""));
								this.weatherisShow = true
							}
						})
					} else {
						this.weather = uni.getStorageSync('weather')
						this.high = parseInt(this.weather.forecast[0].high.replace(/[^0-9]/ig, ""))
						this.low = parseInt(this.weather.forecast[0].low.replace(/[^0-9]/ig, ""));
						if (this.weather.forecast[0].type.indexOf("雨") != -1) {
							this.num = 2
						} else if (this.weather.forecast[0].type.indexOf("晴") != -1) {
							this.num = 1
						} else {
							this.num = 3
						}
						this.weatherisShow = true
					}

				}
			});
			if (global.falg) {
				this.lusercode = uni.getStorageSync('lusercode');
				this.lpassword = uni.getStorageSync('lpassword');
				// let getResult = async () => {
				// let result = await this.testResult();
				// console.log(result[1].data.data.forecast[0]);
				postlogin(this.lusercode, this.lpassword)
					.then(res => {
						if (res.code === 1) {
							global.falg = false
							global.userinfo = res.data
							this.userinfo = res.data
							this.isShow = true
							uni.setStorage({
								key: "token",
								data: res.token,
								success: function() {}
							});
							uni.setStorage({
								key: "userinfo",
								data: res.data,
								success: function() {}
							});
							this.$http.req.defaultData.header.token = res.token
							uni.request({
								url: uni.getStorageSync('IP') + ':' + uni.getStorageSync('PORT') + '/api/sidebar',
								header: {
									'token': res.token
								},
								success: (res) => {
									uni.setStorage({
										key: "tree",
										data: res.data.data,
										success: function() {}
									})
									if (res.data.code === 1) {
										for (let value of res.data.data) {
											if (value.LPARENTID == '00') {
												for (let qq of value.children) {
													if (qq.LMODULENO == '702301') {
														console.log('进来了');
														global.yield = true;
													}
													for (let aa of this.userlist) {
														if (qq.LMENUID == aa.LMENUID) {
															aa.isShow = true
														}
													}
												}
											}
											for (let tt of this.userlist) {
												if (value.LFUNCNAME == tt.name) {
													tt.isShow = true
												}
											}
										}
									}
								}
							})
							getUserStaple(global.userinfo.lusercode).then(res => {
								if (res.code === 1) {
									this.Commonly = res.data
									this.flag = true
								}
							})
						} else {
							this.isShow = true
							// global.falg = false
							uni.redirectTo({
								url: `../login/login`
							});
						}
					})
					.catch(err => {
						// global.falg = false
						uni.showToast({
							title: '访问服务器失败！',
							icon: 'none'
						})
						this.isShow = true
					})
				// }
				// getResult()
			}
			setInterval(() => {
				uni.request({
					url: uni.getStorageSync('IP') + ':' + uni.getStorageSync('PORT') + '/api/login',
					data: {
						lusercode: uni.getStorageSync('lusercode'),
						lpassword: uni.getStorageSync('lpassword')
					},
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					success: (res) => {
						if (res.data.code == 1) {
							uni.setStorage({
								key: "token",
								data: res.data.token,
								success: function() {}
							});
							this.$http.req.defaultData.header.token = res.data.token
						}
					}
				})
			}, 300000)
		},
		methods: {
			getsilder() {
				uni.request({
					url: uni.getStorageSync('IP') + ':' + uni.getStorageSync('PORT') + '/api/sidebar',
					header: {
						'token': uni.getStorageSync('token')
					},
					success: (res) => {
						if (res.data.data.length > 0) {
							uni.setStorage({
								key: "tree",
								data: res.data.data,
								success: function() {}
							})
						}
						if (res.data.msg == '请先登陆') {
							uni.showModal({
								title: '提示',
								content: '登录已过期！请重新登录',
								success: (res) => {
									if (res.confirm) {
										global.falg = true
										setTimeout(() => {
											uni.reLaunch({
												url: '../login/login'
											});
										}, 500)
									} else if (res.cancel) {

									}
								}
							});
						}
						if (res.data.code === 1) {
							for (let value of res.data.data) {
								if (value.LPARENTID == '00') {
									for (let qq of value.children) {
										if (qq.LMODULENO == '702301') {
											console.log('进来了');
											global.yield = true;
										}
										for (let aa of this.userlist) {
											if (qq.LMENUID == aa.LMENUID) {
												aa.isShow = true
											}
										}
									}
								}
								for (let tt of this.userlist) {
									if (value.LFUNCNAME == tt.name) {
										tt.isShow = true
									}
								}
							}
						}
					}
				})
			},
			CompareDate(t1, t2) {
				var date = new Date();
				var a = t1.split(":");
				var b = t2.split(":");
				return date.setHours(a[0], a[1]) > date.setHours(b[0], b[1]);
			},
			imageError(e) {
				if (e.detail.errMsg.indexOf('404') != -1) {
					this.imgList = '/static/images/header@404.jpg'
				}
			},
			change(e) {
				this.userlist = e.listData
				uni.setStorage({
					key: "userlist",
					data: this.userlist
				})
			},
			JumpLogin(e) {
				uni.navigateTo({
					url: '../login/login'
				})
			},
			jumpMessage() {
				uni.navigateTo({
					url: '../Message/Message'
				})
			},
			userout() {
				uni.navigateTo({
					url: '../Message/Pendingdisposal'
				})
			},
			//故障申报
			fault() {
				uni.navigateTo({
					url: '../Message/fault/fault'
				})
			},
			jumpSetting() {
				uni.navigateTo({
					url: '../Message/Messageearlywarning'
				})
			},
			jumpview(index, info) {
				switch (index) {
					case 0:
						uni.navigateTo({
							url: './workshop/workshop'
						})
						break;
					case 9:
						uni.navigateTo({
							url: '../Setting/Settingindex'
						})
						break;
					case 2:
						uni.navigateTo({
							url: './Reportform/Reportform'
						})
						break;
					case 3:
						uni.navigateTo({
							url: './temperature/temperature'
						})
						break;
					case 4:
						uni.navigateTo({
							url: './Repair/Repair'
						})
						break;
					case 5:
						uni.navigateTo({
							url: './personnel/personnel'
						})
						break;
					case 6:
						uni.navigateTo({
							url: './production/production'
						})
						break;
					case 7:
						uni.navigateTo({
							url: './quality/quality'
						})
						break;
					case 1:
						uni.navigateTo({
							url: './OAmanage/OAmanage'
						})
						break;
					default:
						break;
				}
			},
			jumpviewonly(index, info) {
				if (info.name == '退出') {
					uni.showModal({
						title: '提示',
						content: '退出账号将清空当前账号所有内容',
						success: res => {
							if (res.confirm) {
								uni.removeStorageSync('lusercode');
								uni.removeStorageSync('lpassword');
								global.falg = true
								uni.navigateTo({
									url: '../login/login'
								})
							}
						}
					});
				} else {
					uni.navigateTo({
						url: info.url
					})
				}
			}
		},
		watch: {
			Commonly() {
				setTimeout(() => {
					this.$nextTick(() => {
						const query = uni.createSelectorQuery().in(this);
						query.select('.index').boundingClientRect(data => {
							this.scrollH = data.height - this.screenHeight
							if (this.scrollH > uni.upx2px(400)) {
								this.scrollH = uni.upx2px(400)
							}
						}).exec();
					})
				}, 500)
			}
		},
	};
</script>

<style lang="scss">
	page {
		background-color: whitesmoke !important;
		// filter: grayscale(100%);

	}

	.fixed {
		position: fixed;
		width: 100%;
		z-index: 999;
		text-align: center;
		color: #FFFFFF;
		font-size: 32rpx;
	}

	.myimgs {
		width: 50rpx;
		height: 50rpx;
	}

	map,
	.mapBox {
		left: 0;
		z-index: 99;
		mix-blend-mode: screen;
		height: 100rpx;
	}

	map,
	.mapBox {
		width: 750rpx;
	}

	map,
	.mapBox {
		height: 300rpx;
	}


	.index {
		.userbg {
			height: 400rpx;
			width: 100%;
			// background-color: #007aff;
			// background-image: url('https://www.ahlinghui.com/Uploads/image/20190429/images/user-bg1.png');
			// background-image: '~/static/images/Certificateofconformity.png';
			background-repeat: no-repeat;
			background-size: 100% 100%;
			text-align: center;
			color: #fff;
			font-size: 34rpx;
			padding-top: 60rpx;
		}

		.weather {
			position: absolute;
			right: 26rpx;
			top: 100rpx;
		}

		.usercode {
			// position: absolute;
			// background-color: #fff;
			top: 160rpx;
			left: 0rpx;
			right: 0rpx;

			.userinfo {
				display: flex;
				flex-direction: column;
				justify-content: space-around;
				align-items: center;
				margin-top: -100rpx;
				height: 180rpx;

				image {
					width: 160rpx;
					height: 160rpx;
					margin-top: -100rpx;
					// background-color: #CCCCCC;
				}
			}

			.shadow-warp {
				margin-top: 20rpx;
			}
		}

		.showTypeContainer {
			display: flex;
			flex-direction: row;
			justify-content: flex-start;
			align-items: center;
			width: 100%;
			flex-wrap: wrap;
			border-radius: 15px;
			background-color: #fff; // margin-top:320rpx;
			padding-bottom: 20rpx;

			.grid_cell {
				padding-top: 20rpx;
				padding-bottom: 20rpx;
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;

				image {
					width: 60rpx;
					height: 60rpx;
				}

				view {
					margin-top: 10px;
					color: #000;
					font-size: 22rpx;
					line-height: 17px;
				}
			}
		}
	}

	.register-section {
		position: relative;
		left: 0;
		bottom: 24rpx;
		width: 100%;
		font-size: $font-sm + 2upx;
		color: $font-color-base;
		text-align: center;

		text {
			color: $font-color-spec;
			margin-left: 10upx;
		}
	}
</style>
